<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="tf-tensorboard.html">
<!--
tf-tensorboard-demo creates a demo instance of TensorBoard.

It expects to load data from a folder called tensorboard/

The way it ensures the urls are correct is quite hacky.
TODO(danmane): Fix the url handling during cleanup.
-->
<dom-module id="tf-tensorboard-demo">
  <template>
    <template is="dom-if" if="[[_urlsReady]]">
      <tf-tensorboard mode="[[mode]]"></tf-tensorboard>
    </template>
    <template is="dom-if" if="[[!_urlsReady]]">
      <p>
        urls not ready - probably because a dataDir was not provided
      </p>
    </template>
    <style>
    :host {
      display: block;
      width: 100%;
      height: 100%;
      }
    </style>
  </template>
  <script>
    Polymer({
      is: "tf-tensorboard-demo",
      properties: {
        mode: {
          type: String,
          value: "events",
        },
        dataDir: {
          type: String,
        },
        _urlsReady: {
          type: Boolean,
          value: false,
        },
      },
      observers: ['_setupUrls(dataDir)'],
      _setupUrls: function(dataDir) {
        function router(route) {
          return function(tag, run) {
            run = run.replace(/[ \)\(]/g, "_");
            tag = tag.replace(/[ \)\(]/g, "_");
            return dataDir + "/" + route + "/" + run + "/" + tag + ".json";
          };
        }
        TF.Urls.runsUrl = function() {
          return dataDir + "/runs.json"
        };
        TF.Urls.graphUrl = function(run) {
          run = run.replace(/ /g, "_");
          return dataDir + "/graph/" + run + ".pbtxt";
        };
        TF.Urls.scalarsUrl = router("scalars");
        TF.Urls.histogramsUrl = router("histograms");
        TF.Urls.compressedHistogramsUrl = router("compressedHistograms");
        TF.Urls.imagesUrl = router("images");
        TF.Urls.individualImageUrl = function(query) {
          return dataDir + "/individualImage/" + query + ".png";
        }
        this._urlsReady = true;
      },
    });
  </script>
</dom-module>
